<template>
  <GenericManagement
    :dataList="userList"
    :columns="columns"
    :formFields="formFields"
    @add="handleAdd"
    @edit="handleEdit"
    @delete="handleDelete"
    primaryKey="user_id"
    entityName="用户"
  />
</template>

<script setup>
import { ref, onMounted } from 'vue';
import GenericManagement from '../components/GenericManagement.vue';
import axios from 'axios';
import { ElMessage, ElMessageBox } from 'element-plus';

const userList = ref([]);

const columns = [
  { prop: 'user_id', label: 'ID', width: '100' },
  { prop: 'username', label: '用户名', width: '120' },
  { prop: 'email', label: '邮箱', width: '200' },
  { prop: 'gender', label: '性别', width: '100' },
  { prop: 'age', label: '年龄', width: '100' },
  { prop: 'height', label: '身高(cm)', width: '120' },
  { prop: 'weight', label: '体重(kg)', width: '120' },
  { prop: 'activity_level', label: '活动水平', width: '120' },
  { prop: 'goal', label: '目标', width: '120' }
];

const formFields = [
  { prop: 'user_id', label: '用户ID', type: 'input' },
  { prop: 'username', label: '用户名', type: 'input' },
  { prop: 'email', label: '邮箱', type: 'input' },
  {
    prop: 'gender',
    label: '性别',
    type: 'select',
    options: [
      { label: '男', value: '男' },
      { label: '女', value: '女' }
    ]
  },
  { prop: 'age', label: '年龄', type: 'input' },
  { prop: 'height', label: '身高(cm)', type: 'input' },
  { prop: 'weight', label: '体重(kg)', type: 'input' },
  {
    prop: 'activity_level',
    label: '活动水平',
    type: 'select',
    options: [
      { label: '轻度活动', value: '轻度活动' },
      { label: '中度活动', value: '中度活动' },
      { label: '重度活动', value: '重度活动' }
    ]
  },
  {
    prop: 'goal',
    label: '目标',
    type: 'select',
    options: [
      { label: '维持', value: '维持' },
      { label: '减脂', value: '减脂' },
      { label: '增肌', value: '增肌' }
    ]
  }
];

// 获取用户列表
onMounted(async () => {
  try {
    const response = await axios.get('http://localhost:8080/DietManagementSystem_war/admin/user/list');
    userList.value = response.data;
  } catch (error) {
    console.error('获取用户列表失败:', error);
    ElMessage.error('加载用户列表失败，请刷新页面');
  }
});

// 处理添加用户
const handleAdd = async (newUser) => {
  try {
    // 如果用户没有手动输入ID，自动生成一个临时ID
    if (!newUser.user_id) {
      const maxId = userList.value.length > 0 
        ? Math.max(...userList.value.map(user => user.user_id)) 
        : 0;
      newUser.user_id = maxId + 1;
    }
    
    const response = await axios.post('http://localhost:8080/DietManagementSystem_war/admin/user/add', newUser);
    if (response.status === 200) {
      userList.value.push(response.data);
      ElMessage.success('用户添加成功');
    }
  } catch (error) {
    console.error('添加用户失败:', error);
    ElMessage.error('添加用户失败，请检查ID是否唯一');
  }
};

// 处理编辑用户信息
const handleEdit = async (updatedUser) => {
  try {
    const response = await axios.post('http://localhost:8080/DietManagementSystem_war/user/updatePersonalInfo', updatedUser);
    if (response.status === 200) {
      const index = userList.value.findIndex(user => user.user_id === updatedUser.user_id);
      if (index!== -1) {
        userList.value[index] = response.data;
        ElMessage.success('用户信息更新成功');
      }
    }
  } catch (error) {
    console.error('编辑用户信息失败:', error);
    ElMessage.error('编辑用户失败，请检查ID是否正确');
  }
};

// 处理删除用户
const handleDelete = async (id) => {
  try {
    await ElMessageBox.confirm('确定要删除此用户吗？', '提示', {
      type: 'warning'
    });
    
    const response = await axios.delete(`http://localhost:8080/DietManagementSystem_war/admin/user/delete/${id}`);
    if (response.status === 200) {
      userList.value = userList.value.filter(user => user.user_id!== id);
      ElMessage.success('用户删除成功');
    }
  } catch (error) {
    console.error('删除用户失败:', error);
    ElMessage.error('删除用户失败，请稍后再试');
  }
};
</script>

<style scoped>
</style>